import Qt 4.7

Rectangle {
    id: box

    width: 286; height: 170
    color: "transparent"
    radius: 5
    clip: true

    property bool allowCreate: true

    property string selectedText: ""
    property int selectedId: 0

    property alias model: listView.model
    property alias internalWidth: listView.width



    signal itemSelected()
    signal newCategory()

    function appendNewCategory(category) {
        model = daoManager.addCategory(name);
    }

    Component {
        id: delegate

        Text {
            id: wrapper
            height:  40
            color: "white"; text: model.modelData.name
            font {
                family: "Series 60 Sans"; pointSize: 6;
                weight: ListView.view.isCurrentItem ? Font.Bold : Font.DemiBold
            }
            MouseArea {
                id: mouseArea
                anchors.fill: wrapper
                onClicked: {
                    console.log("QML:AdvancedDropDownListBox - I am here!");
                    var idChoice = ListView.view.indexAt(wrapper.x, wrapper.y);
                    console.log("Clicked on id: " + idChoice);
                    if (idChoice >= 0 && idChoice < ListView.view.model.length) {
                        //ListView.view.currentIndex = idChoice;
                        console.log("QML:AdvancedDropDownListBox - 1!");
                        if (ListView.view.model && ListView.view.model[idChoice]) {
                            box.selectedText = ListView.view.model[idChoice].name;
                        } else box.selectedText = "";
                        console.log("QML:AdvancedDropDownListBox - 2!");
                        box.selectedId = idChoice;
                        box.itemSelected();
                    }/* else {
                        box.selectedText = "";
                        box.selectedId = -1;
                    }*/
                    console.log("QML:AdvancedDropDownListBox - I am out!");
                }
            }
        }
    }

    ListView {
        id: listView

        x: 46 ; y: 46; width: 110; height: 114
        clip: true
        delegate: delegate
    }

    Image {
        id: upArrow

        x: 10; y: 102
        visible: false
        source: "../resources/pixmaps/seta3.png"
    }

    Image {
        id: downArrow

        x: 10; y: 135
        visible: false
        source: "../resources/pixmaps/seta4.png"
    }

    Button {
        id: newCategoryButton

        x: 145; y: 119; width: 122; height: 37
        noBox: true; color: "transparent"
        text: "+ Criar Categoria"; textColor: "#00adef"
        fontPointSize: 5
        visible: box.allowCreate

        onClicked: parent.newCategory()
    }
}
